import React, { useState } from 'react';
import { Layout } from 'antd';
import Siderbar from './components/Siderbar/Siderbar';
import Header from './components/Header/Header';
import Content from './components/Content/Content';

const AppLayout = ({ children }) => {
  const [collapsed, setCollapsed] = useState(false);

  return (
    <Layout className="container">
      <Header />
      <Layout className="main">
        <Siderbar collapsed={collapsed} setCollapsed={setCollapsed} />
        <Content>{children}</Content>
      </Layout>
    </Layout>
  );
};

export default AppLayout;
